<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <style>
    html {
      /* font-size: clamp(50px, 5.208333333333334vw, 200px); */
      font-size: 26.666666vw;
    }

    :is(html, body) {
      margin: 0;
      padding: 0;
      width: 100%;
      height: 100%;


    }

    body {
      display: grid;
      place-items: center;

    }

    .box {
      outline: 1px solid red;
      width: 80vw;
      height: 60vh;
      display: grid;
      font-size: 0.14rem;
      /* row-gap: 10px; */
      /* column-gap: 8px; */
      /* gap: 16px; */
      /* grid-template-columns: 100px 100px 100px;; */
      /* grid-template-rows: repeat(3, 1fr); */
      /* grid-template-columns: repeat(3, 1fr); */
      /* grid-template-columns: repeat(3, 33.33%); */
      /* grid-template-columns: repeat(2, 100px 20px 80px); */
      /* grid-template-rows: repeat(2, 1fr); */
      /*auto-fill会用空单元格填满剩余宽度*/
      /* grid-template-columns: repeat(auto-fill, 100px); */
      grid-template-columns: repeat(auto-fit, 100px);

      /* grid-template-columns: 1fr 1fr; */

      /* grid-template-columns: 1fr 1fr minmax(100px, 1fr); */
      /* grid-template-columns: 100px auto 100px; */

      /* grid-template-columns: repeat(12, 1fr); */


      /* grid-template-areas: 'a b c'
        'd e f'
        'g h i'; */


      /* grid-auto-flow: column; */
      /* grid-auto-rows: 50px; */
      /* place-items: center;*/
      /* place-content: center;  */
    }

    .item {
      outline: 1px solid rgb(6, 1, 1);
    }

    .child {
      font-size: 24px;
      height: 1em;
      width: 1em;
      background-color: red;
    }
  </style>
  <div class="em">
    <div class="father">
      <div class="child">xxx</div>
    </div>

  </div>
  <div class="box">
    <div class="item">
      <span>1</span>
      <div>a</div>
    </div>
    <div class="item">2</div>
    <div class="item">3</div>
  </div>
  <script>

    console.log(
      '......................我佛慈悲......................\n\n' +
      '                      _ooOoo_\n' +
      '                     o8888888o\n' +
      '                     88" . "88\n' +
      '                     (| -_- |)\n' +
      '                     O\\  =  /O\n' +
      "                  ____/`---'\\____\n" +
      "                .'  \\|     |//  `.\n" +
      '               /  \\|||  :  |||//  \\\n' +
      '              /  _||||| -:- |||||-  \\\n' +
      '              |   | \\  -  /// |   |\n' +
      "              | \\_|  ''\\---/''  |   |\n" +
      '              \\  .-\\__  `-`  ___/-. /\n' +
      "             ___`. .'  /--.--\\  `. . __\n" +
      '          .',
      " '<  `.___\\_<|>_/___.'  >' ",
      '.\n' +
      '         | | :  `- \\`.;` _ /`;.`/ - ` : | |\n' +
      '         \\  \\ `-.   \\_ __\\ /__ _/   .-` /  /\n' +
      "     ======`-.____`-.___\\_____/___.-`____.-'======\n" +
      "                       `=---='" +
      '\n\n  ................佛祖开光，永无 BUG..................',
    );


    function test() {
      try {
        a
      } catch (error) {
        // throw 1
        console.log('==catch====>', error)
      }
      finally {
        console.log('==finally====>',)
      }
      console.log('==主线====>',)
    }
    // test()

    // const arr = [11, 22, 33, 44, 55, 66]
    // // arr.splice(1, 0, 3, 4)
    // const str = '123456'
    // console.log('==arr====>', arr.join())
    // console.log('==str====>', str.split())
  </script>
</body>

</html>